<?php
session_start();
include "./conf/.htconfig.php";
?>
<!DOCTYPE HTML>
<html>
  <head>
    <title>VAT beta</title>
    <link rel="stylesheet" type="text/css" href="<?= $conf['base_url'] ?>style/style.css" media="screen" />
    <link type="text/css" href="<?= $conf['jqueryuistyle'] ?>" rel="stylesheet" />	
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <script type="text/javascript" src="<?= $conf['jquerysrc'] ?>"></script>
    <script type="text/javascript" src="<?= $conf['modernizrsrc'] ?>"></script>
    <script type="text/javascript" src="<?= $conf['jqueryuisrc'] ?>"></script>
    <script type="text/javascript" src="<?= $conf['base_url'] ?>js/support.js"></script>
    <script type="text/javascript">
      $(document).ready( function() {
          <?php
  if (isset($_GET['error']) && $_GET['error'] == "no_video_set") :
    ?>
        $( "#error_no_video_set" ).dialog({
			resizable: false,
			modal: true,
      width: 600,
			buttons: {
				"Fortsätt": function() {
					var url = "<?= $conf['base_url'] ?>index.php";
          window.location.href = url;
				}
			}
		});
        <?php
          
  endif;
  ?>
        $("#annotate").click( function () {
          var url = "<?= $conf['base_url'] ?>annotate.php";
          window.location.href = url;
        });
        
        $("#view_result").click( function () {
          var url = "<?= $conf['base_url'] ?>view_results.php";
          window.location.href = url;
        });
        
        $("#video").change(function () {
          var data = "video=" + $(this).val();
                $.ajax({
                    type: "POST",
                    url: "setVideoSession.php",
                    data: data,
                    dataType: 'json',
                    success: function(data){
                        if (data.result == 1) {
                          //set button active!
                        }
                        
                    }
                });
        });
      });
    </script>
    <noscript>
  <div class="error_bar"><p style="text-align: center; font-weight: bold; width: 1000px; margin: auto;">Du har stängt av Java Script eller använder en webbläsare som inte stödjer Java Script, därför kan du inte använda detta program som det är tänkt. Gå till <a href="help.php">hjälp</a> om du vill få mer information!</p></div>
  </noscript>
</head>
<body>
  <header>
    <div id="header">Video Annotation Tool</div>
  </header>
  <?php include "menu.php" ?>
  <div id="box">
    <select id="video">
      <?php
      foreach (new DirectoryIterator("./video/") as $fileInfo) {
        if (!$fileInfo->isFile())
          continue;
        $filename = $fileInfo->getFilename();
        $ext = pathinfo($filename, PATHINFO_EXTENSION);
        
        //currently restricted to ogv format.
        if ($ext === "ogv") {

          $name = pathinfo($filename, PATHINFO_FILENAME);
          $video_name = str_replace("_", " ", $name);
          if (isset($_SESSION['video'])):
            if ($_SESSION['video'] == $name):
              echo "<option selected='selected' value='{$name}'>{$video_name}</option>";
            else:
              echo "<option value='{$name}'>{$video_name}</option>";
            endif;
          else:
            $_SESSION['video'] = $name;
            $_SESSION['video_name'] = $video_name;
            echo "<option selected='selected' value='{$name}'>{$video_name}</option>";
          endif;          
        }
      }
      ?>
    </select>
    <button type="button" name="annotate" id="annotate">Gör markeringar</button>
    <button type="button" name="view_result" id="view_result">Visa resultat</button>
  </div>
  <?php
  if (isset($_GET['error']) && $_GET['error'] == "no_video_set") :
    ?>

    <div id="error_no_video_set" title="Ingen Video vald">
      <p>Du har inte valt någon video, men måste göra detta för att kunna göra markeringar och se resultaten. För mer information se <a href="<?=$conf['base_url']?>help.php">Hjälp-sidan</a>.</p>
    </div>  
    <?php
  unset($_GET['error']);
  endif;
  ?>
</body>
</html>